<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
    <link rel="stylesheet" href="/static/css/base.css">
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/css/surveryAll.css">
    <link rel="stylesheet" href="/static/css/index.css">
    <link rel="stylesheet" href="/static/layui/css/layui.css">

</head>

<body>
    <div class="banner">
        <div style="margin-left: 5vw;">
            <div class="dropdown">
                <a class="a-style">问卷管理</a>
                <div class="dropdown-content" style="width: 150px;">
                    <a href="/surveyAll">所有问卷</a>
                    <a href="/published">已发布问卷</a>
                    <a href="/unpublished">未发布问卷</a>
                </div>
            </div>

            <div class="dropdown">
                <a class="a-style" href="/surveyGround">问卷广场</a>
            </div>


            <div class="dropdown users">
                <a><img class="content" src="/static/img/人物-人.png" alt=""></a>
                <label>{{username}}</label>
                <div class="dropdown-content" style="width: 150px;">
                    <a href="" onclick="logout()">退出</a>
                </div>
            </div>

        </div>
    </div>
    <div class="container">
        {% for item in surveys %}
        <div id="{{item.id}}" class="survey-card shadow p-3 mb-5 bg-white rounded">
            <div class="btn-remove-update">
                <input class="remove" type="button" onclick="remove('{{item.id}}')">
                <input class="update" type="button" onclick="update('{{item.id}}')">
                <input class="datatable" type="button" onclick="datatable('{{item.id}}')">
                <input class="share" type="button" id="copy"
                    data-clipboard-text="qa.chewelve.top/surveypage/{{item.id}}">
            </div>
            <a href="#" onclick="getId('{{item.id}}')">
                <div class="a_lable">
                    <div>
                        <label>主题: {{item.surveyTheme}}</label>
                    </div>
                    <div>
                        <label>说明: {{item.surveyState}}</label>
                    </div>

                    <div>
                        <label>创建时间: {{item.updatedTime}}</label>
                    </div>
                    <div>
                        <label>状态:</label><label id="statelabel"> {{item.stateName}}</label>
                    </div>
                </div>
            </a>
        </div>
        {% endfor %}
        <a href="/createpage">
            <div id="" class="survey-card shadow p-3 mb-5 bg-white rounded">
                <div class="addimg">
                    <img src="/static/img/加号 (2).png" alt="">
                </div>
            </div>
        </a>
    </div>



    <script src="/static/js/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
    <script src="/static/layui/layui.js"></script>
    <script type="text/javascript" src="/static/js/clipboard.min.js"></script>
    <script>
        let id = $('.survey-card #statelabel').length;
        for (var i = 0; i < id; i++) {
            let name = $('.survey-card #statelabel')[i].innerText;
            if (name === "未发布") {
                let html = $('.survey-card .datatable').eq(i).css("display", "none");
                $('.survey-card .share').eq(i).css("display", "none");
            } else if (name === "已发布") {
                $('.survey-card .update').eq(i).css("display", "none");
            }
        }

        $(function () {
            var clipboard = new Clipboard('#copy');
            clipboard.on('success', function (e) {
                alert('复制成功！')
            });
            clipboard.on('error', function (e) {
                alert('复制失败，请稍后重试！')
            });
        });

    </script>
    <script>
        // let currentId = "";
        // function getId(surveyId) {
        //     currentId = surveyId;
        //     getsurvey(currentId);
        // }

        function getId(surveyId) {
            let currentId = surveyId;
            axios({
                method: 'post',
                url: '/surveypage/judge',
                data: {
                    surveyId: currentId
                }
            }).then(function (response) {
                let res = response.data;
                console.log(res.id);
                window.location.href = `/survey/sendpage/${res.id}`;
            }).catch((err) => {

            });
        }


        function remove(id) {
            layer.confirm('确定删除吗？', { icon: 2, title: '提示' }, function (index) {
                axios({
                    method: 'post',
                    url: '/surveypage/remove',
                    data: {
                        removeId: id
                    }
                }).then(function (response) {
                    // axios工具下，服务器真正返回的数据在返回对象的data中
                    var res = response.data;
                    if (res.code === 200) {
                        window.location.href = '/surveyAll';
                    }
                })
                layer.close(index);
            });
        }

        function update(id) {
            currentId = id;
            axios({
                method: 'post',
                url: '/surveypage/updateJudge',
                data: {
                    currentId
                }
            }).then(function (response) {
                let res = response.data;
                window.location.href = `/surveypage/update/${id}`
            }).catch((err) => {

            });
        }

        function datatable(id) {
            window.location.href = `/survey/datapage/${id}`
        }


        function logout() {
            axios({
                method: 'post',
                url: '/logout'
            }).then(function (response) {
                // axios工具下，服务器真正返回的数据在返回对象的data中
                let res = response.data;
                if (res.code === 200) {
                    window.location.href = '/';
                }
            }).catch((err) => {

            });
        }
    </script>
</body>

</html>